<template>
  <a-modal v-model:visible="showVisible" title="文案库" @cancel="closeModal" :width="1200" :getContainer="getContainer"
    zIndex="1001" :footer="null" :bodyStyle="{
      padding: 0
    }">
    <div class="container">
      <Textlibrary :tableHeight="500" @importSuccess="onSuccess" :isComponents="isComponents" :selectType="selectType"
        ref="textlibrary" />
    </div>
  </a-modal>
</template>

<script setup>
import { ref, computed, onMounted, watch, createVNode, inject } from "vue";
import Textlibrary from "@/views/shotstack/AiCreation/Textlibrary.vue";
const emit = defineEmits(["importSuccess"]);
const props = defineProps({
  // 是否作为组件的形式呈现
  isComponents: {
    type: Boolean,
    default: true,
  },
  // 勾选的模式, 默认多选
  selectType: {
    type: Text,
    default: "radio",
    // default: "checkbox",
  },
});
let showVisible = ref(false);
const showModal = () => {
  showVisible.value = true;
};
let textlibrary = ref(null);
const closeModal = () => {
  showVisible.value = false;
  textlibrary.value && textlibrary.value.claerSelect();
};
const onSuccess = (info) => {
  emit("importSuccess", info);
  showVisible.value = false;
};
defineExpose({
  showModal,
  closeModal,
});
</script>

<style lang="less" scoped>
.container {
  height: 600px;
}
</style>
